Updated April 19, 2023

jQuery select value lets you get the value of the selected option from the select boxes and dropdowns. jQuery offers two methods, val() and text()to achieve this. jQuery: selected selector is used in combination with the val() or text() method to find the value for the selected option in a select box or dropdown. Using val() method, we get the value to be sent to the server and with text() method, we get the text value of the selected element.

Start Your Free Software Development Course

Web development, programming languages, Software testing & others

Syntax:

1. Using val() method: val() method is used to return the value of the selected element

2. Using text() method: text() method is used to return the text value (string) of the selected element

where,val() and text() do not accept any arguments.

Select elements basically have two values that can be accessed. The first value is to be sent to the server, which we can get using val() The second value is the text value of the selected element which we can get using text() method.

Where, books is the value returned by val() method. Englishis the value returned by text() method.

Let us go through few examples to understand how to get the select values from select boxes using jQuery.

This example demonstrates how jQuery select value actually works with val() method.

Code:

Output:

This example demonstrates how jQuery select value actually works with text() method.

Code:

Output:

This example demonstrates how the selected values can be retrieved from multiple select boxes using jQuery.

Code:

Output:

Given below is another similar example that demonstrates how the selected values can be retrieved from multiple select boxes using jQuery.

Code:

Output:

This is a guide to jQuery Select Value. Here we also discuss the introduction and how does jquery select value work? along with different examples and its code implementation. You may also have a look at the following articles to learn more –